<template>
  {{ greeting }}
</template>

<script lang="ts">
  import { defineComponent, ref } from 'vue';

  export default defineComponent({
    setup() {
      const greeting = ref('');

      const getTimeGreeting = () => {
        const now = new Date();
        const hour = now.getHours();
        if (hour >= 6 && hour < 12) {
          greeting.value = '早上好! ';
        } else if (hour >= 12 && hour < 18) {
          greeting.value = '下午好! ';
        } else {
          greeting.value = '晚上好! ';
        }
      };

      getTimeGreeting();

      return {
        greeting,
      };
    },
  });
</script>
